<!--
 * @FilePath     : /study_code/layui/5-1-1.html
 * @Description  : layui.define() 自定义 layui 模块
 * @Date         : 2025-04-08 15:48:51
 * @Author       : Fang YingGui
 * @LastEditors  : fangyinggui 18715384437@163.com
 * @LastEditTime : 2025-04-08 15:48:59
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>documentName</title>
    <link rel="stylesheet" href="/layui/dist/css/layui.css" />
  </head>
  <body>
    <h2>layui根文件</h2>
    <script src="/layui/dist/layui.js"></script>
    <script>
      /*
      1、使用 layui.define() api 定义一个 模块mod1；
      tip: 直接定义
      */
      layui.define(function (exports) {
        console.log('mod1 模块注册')
        exports('mod1', {
          msg: 'h1 mod1!',
        })
      })

      /*
      2、定义另一个模块 mod2；
      tip: 依赖其它模块
      */
      layui.define(['layer'], function (exports) {
        var layer = layui.layer
        layer.msg('依赖其它模块')
        console.log('mod2 模块注册')
        exports('mod2', {
          msg: 'hi mod2!',
        })
      })

      /*
      3、尝试定义已经存在的模块；
      */
      layui.define(function (exports) {
        exports('table2', {
          msg: 'hi mod3!',
        })
      })

      /*
      4、使用模块；
      */
      layui.use(['mod1', 'mod2', 'layer'], function () {
        var layer = layui.layer,
          mod1 = layui.mod1,
          mod2 = layui.mod2,
          table2 = layui.table2
        layer.msg('使用')
      })

      /*
      5、查看模块名；
      */
      console.log('name', layui)

      // 尝试获取模块的 callback
      btn.addEventListener('click', function () {
        var call = layui.factory('mod2')
        call()
      })
    </script>
  </body>
</html>
